<template>
  <div style="margin: 30px">
    <el-row>
      <el-col
          v-for="(o, index) in courseList"
          :key="index"
          :span="4"
          :offset="index > 0 ? 2 : 0"
      >
        <el-card :body-style="{ padding: '0px' }">
          <img
              src="https://shadow.elemecdn.com/app/element/hamburger.9cf7b091-55e9-11e9-a976-7f4d0b07eef6.png"
              class="image"
          />
          <div style="padding: 34px">
            <span></span>
            <div class="bottom">
              <span class="time">{{o.courseName}}</span>
              <el-button text class="button" @click="test">学科考试></el-button>
            </div>
            <div style="margin-top: 20px">
              <el-upload
                  :file-list="fileList[index]"
                  class="upload-demo"
                  :before-remove="beforeFile"
                  :on-remove="removeFile"
				  :headers="Headers"
                  :action="uploadUrl.url+`/`+o.courseId"
                  multiple
                  :limit="3"
              >
                <el-button type="primary">上传课件</el-button>
                <template #tip>
                  <div class="el-upload__tip">
                    文件大小不能超过500MB.
                  </div>
                </template>
              </el-upload>
            </div>
          </div>
        </el-card>
      </el-col>
    </el-row>
  </div>
</template>
<script>
function myfile(name,url,id){
  this.name=name;
  this.url = url;
  this.id = id
}
import { ElMessage, ElMessageBox } from 'element-ui';

export default {
  created() {
    //发送请求获取教授的课程列表
    let user = JSON.parse(localStorage.getItem("user"))
    this.request.get("/class/course/"+user.id).then(resp=>{
      this.courseList = resp.data
      //数据提取
      resp.data.forEach(item=>{
          let files =  item.files.map(item=>{
            return new myfile(item.fileName,item.fileUrl,item.id)
          })
          this.fileList.push(files)
      })
    })
  },
  methods: {
    beforeFile(uploadFile, uploadFiles) {
      return this.$confirm(`确定删除课件${uploadFile.name}？`);
    },
    removeFile(file,fileList){
      //发出删除文件的请求
      console.log(file)
      this.request.get("/teacher/remove/"+file.id).then(resp=>{

      })
    },

  },
  data(){
    return{
      uploadUrl:{
        url:"http://localhost:9090/teacher/upload/"+JSON.parse(localStorage.getItem("user")).id+"/"
      },
      courseList:[],
      fileList:[],
	  Headers:"application/json"
    }
  }
}

</script>
<style>
.time {
  font-size: 16px;
  font-weight: 400;
  color: #999;
}

.bottom {
  margin-top: 13px;
  line-height: 12px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.button {
  padding: 0;
  min-height: auto;
}

.image {
  width: 100%;
  display: block;
}
</style>